<template>
  <div class="container">
    <div class="boxWrap">
      <!-- 头部 -->
      <loginHeader></loginHeader>
      <!-- 注册表单 -->
      <div class="mainBox registerMainBox" v-show="isRegister">
        <!-- 企业顶部提示 -->
        <el-row class="reminder" v-if="companyType === 'CONSTRUCTOR'">
          <i class="el-icon-warning"></i>
          企业用户在业务系统中为项目建档后，可对接已建档项目
        </el-row>
        <!-- 工程项目顶部提示 -->
        <el-row class="reminder" v-if="companyType === 'PROJECT'">
          <i class="el-icon-warning"></i>
          工程项目用户请先在系统中建档，再申请接口账号与平台对接
        </el-row>
        <el-row class="formTop">
          <div class="loginLink">
            <span>已有接口平台账号，</span>
            <span @click="skipLogin" class="toLogin">立即登录</span>
          </div>
          <div class="applyTitle">申请接口账号</div>
        </el-row>
        <el-form
          :model="ruleForm"
          :rules="rules"
          ref="ruleForm"
          class="ruleForm"
          status-icon
          aria-autocomplete="false"
          label-width="140px"
        >
          <el-form-item label="单位类型">
            <span v-if="companyType === 'GOV'">政府部门</span>
            <span v-if="companyType === 'PLAT'">第三方平台</span>
            <span v-if="companyType === 'CONSTRUCTOR'">企业</span>
            <span v-if="companyType === 'PROJECT'">工程项目</span>
            <el-link
              type="primary"
              @click="toRegister()"
              style="margin-left: 10px"
              >修改</el-link
            >
          </el-form-item>
          <template
            v-if="
              companyType === 'GOV' ||
              companyType === 'PLAT' ||
              companyType === 'CONSTRUCTOR'
            "
          >
            <el-form-item label="单位名称" prop="companyName">
              <el-input
                v-model.trim="ruleForm.companyName"
                @change="
                  validUsccAndCompany(ruleForm.companyName, ruleForm.uscc)
                "
                placeholder="请输入单位名称"
                clearable
                @blur="ruleForm.companyName = changeValue($event)"
              ></el-input>
            </el-form-item>
            <el-form-item label="统一社会信用代码" prop="uscc">
              <el-input
                v-model.trim="ruleForm.uscc"
                @change="
                  validUsccAndCompany(ruleForm.companyName, ruleForm.uscc)
                "
                placeholder="请输入单位统一社会信用代码"
                clearable
                @blur="ruleForm.uscc = changeValue($event)"
              ></el-input>
            </el-form-item>
          </template>
          <template v-else>
            <el-form-item label="项目名称" prop="projectName">
              <el-input
                v-model.trim="ruleForm.projectName"
                placeholder="请输入完整的项目名称"
                clearable
                @blur="changeProjectName"
                @clear="clearOption"
              ></el-input>
            </el-form-item>
            <el-form-item label="建设方" prop="pcName">
              <el-input
                v-model.trim="ruleForm.pcName"
                placeholder="请选择项目名称后展示"
                clearable
                @blur="ruleForm.pcName = changeValue($event)"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="施工方" prop="pbName">
              <el-input
                v-model.trim="ruleForm.pbName"
                placeholder="请选择项目名称后展示"
                clearable
                @blur="ruleForm.pbName = changeValue($event)"
                disabled
              ></el-input>
            </el-form-item>
          </template>
          <el-form-item label="负责人姓名" prop="name">
            <el-input
              v-model.trim="ruleForm.name"
              placeholder="请输入负责人姓名"
              clearable
              @blur="ruleForm.name = changeValue($event)"
            ></el-input>
          </el-form-item>
          <el-form-item label="负责人手机号" prop="phone">
            <el-input
              v-model.trim="ruleForm.phone"
              placeholder="用于接收审核结果和后期账号安全设置"
              clearable
              @blur="ruleForm.phone = changeValue($event)"
            ></el-input>
          </el-form-item>
          <el-form-item label="短信验证码" prop="vscode" class="vscodeInput">
            <el-input
              v-model.trim="ruleForm.vscode"
              placeholder="输入短信验证码"
              clearable
              @blur="ruleForm.vscode = changeValue($event)"
            ></el-input>
            <el-button
              size="medium"
              class="vscodeBtn"
              v-show="!isCount"
              v-sdc
              @click="getVscode()"
              :disabled="noTel"
              >获取验证码</el-button
            >
            <el-button
              type="info"
              plain
              size="medium"
              round
              v-show="isCount"
              disabled
              >{{ countDownTime }}s后重新获取</el-button
            >
          </el-form-item>
          <!-- 1.政府部门  4张： 委托书，企业营业执照，身份证正反面  2.企业/工程项目 2张： 身份证正反面 -->
          <el-form-item
            label="认证资料"
            prop="uploadFile"
            class="imgLabel"
            style="width: 620px"
          >
            <ul class="imgBoxs clearfix">
              <li class="imgBox">
                <div class="imgTopBox">
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="点击上传图片"
                    placement="bottom"
                  >
                    <form class="uploadBtn" id="attorneyForm">
                      <input
                        type="file"
                        name="file"
                        id="attorneyFile"
                        accept="image/png, image/jpeg, image/jpg"
                        @change="
                          uploadImg(
                            'attorneyFile',
                            0,
                            'attorneyForm',
                            'ATTORNEY'
                          )
                        "
                      />
                      <i class="el-icon-plus"></i>
                      <img :src="file[0].imgSrc" v-show="file[0].isShow" />
                    </form>
                  </el-tooltip>
                  <div class="imgName">申请接入凭证</div>
                </div>
                <!-- <el-button type="text" @click="attorneyDialog = true">下载说明书</el-button> -->
                <el-button type="text" @click="downLoad">下载说明书</el-button>
              </li>
              <template
                v-if="
                  companyType === 'GOV' ||
                  companyType === 'PLAT' ||
                  companyType === 'CONSTRUCTOR'
                "
              >
                <li class="imgBox">
                  <div class="imgTopBox">
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="点击上传图片"
                      placement="bottom"
                    >
                      <form class="uploadBtn" id="licenseForm">
                        <input
                          type="file"
                          name="file"
                          id="licenseFile"
                          accept="image/png, image/jpeg, image/jpg"
                          @change="
                            uploadImg(
                              'licenseFile',
                              1,
                              'licenseForm',
                              'LICENSE'
                            )
                          "
                        />
                        <i class="el-icon-plus"></i>
                        <img :src="file[1].imgSrc" v-show="file[1].isShow" />
                      </form>
                    </el-tooltip>
                    <div class="imgName">企业营业执照</div>
                  </div>
                  <el-button type="text" @click="licenseDialog = true"
                    >示例图</el-button
                  >
                </li>
              </template>
              <li class="imgBox">
                <div class="imgTopBox">
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="点击上传图片"
                    placement="bottom"
                  >
                    <form class="uploadBtn" id="idcardForm1">
                      <input
                        type="file"
                        name="file"
                        id="idcardFront"
                        accept="image/png, image/jpeg, image/jpg"
                        @change="
                          uploadImg(
                            'idcardFront',
                            2,
                            'idcardForm1',
                            'IDCARDFRONT'
                          )
                        "
                      />
                      <i class="el-icon-plus"></i>
                      <img :src="file[2].imgSrc" v-show="file[2].isShow" />
                    </form>
                  </el-tooltip>
                  <div class="imgName">负责人身份证正面</div>
                </div>
                <el-button type="text" @click="idcardDialogOne = true"
                  >示例图</el-button
                >
              </li>
              <li class="imgBox">
                <div class="imgTopBox">
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="点击上传图片"
                    placement="bottom"
                  >
                    <form class="uploadBtn" id="idcardForm2">
                      <input
                        type="file"
                        name="file"
                        id="idcardBack"
                        accept="image/png, image/jpeg, image/jpg"
                        @change="
                          uploadImg(
                            'idcardBack',
                            3,
                            'idcardForm2',
                            'IDCARDBACK'
                          )
                        "
                      />
                      <i class="el-icon-plus"></i>
                      <img :src="file[3].imgSrc" v-show="file[3].isShow" />
                    </form>
                  </el-tooltip>
                  <div class="imgName">负责人身份证反面</div>
                </div>
                <el-button type="text" @click="idcardDialogTwo = true"
                  >示例图</el-button
                >
              </li>
            </ul>
          </el-form-item>
          <el-form-item label="" class="contarctBorderBottom">
            <el-checkbox v-model="boxChecked"></el-checkbox>
            我已阅读并同意
            <span class="contract" @click="toRegistration()"
              >《用户注册协议》</span
            >
            和
            <span class="contract" @click="toCreditcommitment()"
              >《信用承诺》</span
            >
          </el-form-item>
          <el-form-item
            label=""
            prop=""
            style="text-align: left; margin-top: 20px"
          >
            <el-button
              v-show="boxChecked"
              type="primary"
              size="medium"
              class="submitBtn registerBtn saveBtn"
              @click="submitForm('ruleForm')"
              :loading="isSubmit"
              >提交申请</el-button
            >
            <el-button
              v-show="!boxChecked"
              type="info"
              disabled
              size="medium"
              class="submitBtn registerBtn"
              >提交申请</el-button
            >
          </el-form-item>
        </el-form>
        <div class="contarctTopBorder"></div>
      </div>
      <!-- 注册完成 -->
      <div class="mainBox registered" v-show="!isRegister">
        <img src="/static/img/success.png" alt />
        <div class="suceesRemind">账号申请提交成功</div>
        <div class="messageRemind">
          审核需要1-3个工作日，审核通过后，审核结果将账号密码发送到负责人手机号
          <span>{{ ruleForm.phone }}</span
          >，请您留意查收
        </div>
        <el-button size="medium" class="submitBtn" @click="skipLogin"
          >返回登录</el-button
        >
      </div>
    </div>
    <el-dialog
      title="委托书"
      :visible.sync="attorneyDialog"
      width="700px"
      :modal-append-to-body="false"
    >
      <img src="/static/img/register/attorney.png" width="600px;" />
    </el-dialog>
    <el-dialog
      title="营业执照示例图"
      :visible.sync="licenseDialog"
      width="500px;"
      :modal-append-to-body="false"
    >
      <img src="/static/img/register/license.jpg" width="400px;" />
    </el-dialog>
    <el-dialog
      title="身份证正面示例图"
      :visible.sync="idcardDialogOne"
      width="500px"
      :modal-append-to-body="false"
    >
      <img src="/static/img/register/idcard2.jpg" width="400px;" />
    </el-dialog>
    <el-dialog
      title="身份证反面示例图"
      :visible.sync="idcardDialogTwo"
      width="500px"
      :modal-append-to-body="false"
    >
      <img src="/static/img/register/idcard1.jpg" width="400px;" />
    </el-dialog>
  </div>
</template>

<script>
import jqFrom from '../../kits/jquery.form'
import common from '../../kits/common'
import loginHeader from '@/components/publicCom/loginHeader'

export default {
  name: 'registerNextInterfaceAccount',
  components: {
    loginHeader,
  },
  data() {
    //验证企业名称
    var validateCompanyName = (rule, value, callback) => {
      value = value.replace(/\s+/g, '')
      if (value === '') {
        callback(new Error('请输入单位名称'))
      } else {
        if (value.length > 50) {
          callback(new Error('单位名称最多可输入50个字'))
        } else {
          if (this.ruleForm.uscc !== '') {
            this.$refs.ruleForm.validateField('uscc')
          }
          callback()
        }
      }
    }
    //验证uscc
    var validateUscc = (rule, value, callback) => {
      value = value.replace(/\s+/g, '')
      if (value === '') {
        callback(new Error('请输入统一社会信用代码'))
      } else {
        var regUscc = /^[0-9A-Z]{2}[0-9]{6}[0-9A-Z]{10}$/
        if (!regUscc.test(value)) {
          callback(new Error('统一社会信用代码格式不正确'))
        } else {
          callback()
        }
      }
    }
    //验证负责人姓名
    var validateName = (rule, value, callback) => {
      if (!value) {
        callback(new Error('请输入负责人姓名'))
      } else {
        if (value.length > 50) {
          callback(new Error('负责人姓名最多可输入50个字'))
        } else {
          callback()
        }
      }
    }
    //验证手机号码
    var validatePhone = (rule, value, callback) => {
      value = value.replace(/\s+/g, '')
      if (value === '') {
        callback(new Error('请输入负责人手机号'))
      } else {
        var regTel = /^1[3456789]\d{9}$/
        if (!regTel.test(value)) {
          callback(new Error('手机号码格式不正确'))
        } else {
          this.noTel = false
        }
        callback()
      }
    }
    //验证验证码
    var validateVscode = (rule, value, callback) => {
      value = value.replace(/\s+/g, '')
      if (value === '') {
        callback(new Error('请输入短信验证码'))
      } else {
        this.axios({
          method: 'post',
          url: 'api-bs/message/base/checkvc',
          data: {
            tel: this.ruleForm.phone.replace(/\s+/g, ''),
            vc: value,
          },
        }).then(
          (res) => {
            if (!res.data.hasError) {
              callback()
            } else {
              callback(new Error(res.data.errorMsg))
            }
          },
          (response) => {
            callback(new Error('验证失败'))
          }
        )
      }
    }
    var validUploadFile = (rele, value, callback) => {
      //有认证资料未上传则提示不消失
      if (
        this.companyType === 'GOV' ||
        this.companyType === 'PLAT' ||
        this.companyType === 'CONSTRUCTOR'
      ) {
        if (
          this.file[0].isShow == false ||
          this.file[1].isShow == false ||
          this.file[2].isShow == false ||
          this.file[3].isShow == false
        ) {
          callback(new Error('请完整上传认证资料'))
        } else {
          callback()
        }
      } else if (this.companyType === 'PROJECT') {
        if (
          this.file[0].isShow == false ||
          this.file[2].isShow == false ||
          this.file[3].isShow == false
        ) {
          callback(new Error('请完整上传认证资料'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    return {
      bg: require('../../../static/img/login/loginBb.png'), //背景图
      isRegister: true, //注册开始
      noTel: false,
      isSubmit: false, //提交按钮禁止点击
      isCount: false, //是否在倒计时
      countDownTime: 60 /*倒计时 计数器*/,
      attorneyDialog: false, //委托书示例图
      licenseDialog: false, //营业执照示例图
      idcardDialogOne: false, //身份证示例图
      idcardDialogTwo: false, //身份证示例图
      projectOptions: [], //项目名称
      projectList: [],
      rules: {
        companyName: [
          {
            required: true,
            validator: validateCompanyName,
            trigger: 'blur',
          },
        ],
        projectName: [
          {
            required: true,
            message: '请输入完整的项目名称',
            trigger: 'blur',
          },
        ],
        pcName: [
          {
            required: true,
            message: '请先选择项目名称后展示',
            trigger: 'blur',
          },
        ],
        pbName: [
          {
            required: true,
            message: '请先选择项目名称后展示',
            trigger: 'blur',
          },
        ],
        uscc: [
          {
            required: true,
            validator: validateUscc,
            trigger: 'blur',
          },
        ],
        name: [
          {
            required: true,
            validator: validateName,
            trigger: 'blur',
          },
        ],
        phone: [
          {
            required: true,
            validator: validatePhone,
            trigger: 'blur',
          },
        ],
        vscode: [
          {
            required: true,
            validator: validateVscode,
            trigger: 'blur',
          },
        ],
        uploadFile: [
          {
            required: true,
            validator: validUploadFile,
            trigger: 'change',
          },
        ],
      },
      ruleForm: {
        companyName: '',
        projectName: '',
        uscc: '',
        pbName: '',
        pcName: '',
        name: '',
        phone: '',
        vscode: '',
        agreed: 1,
      },
      file: [
        {
          //上传图片
          originalName: '', //原文件名
          imgId: '', //图片id
          newName: 'ENTRUSTMENT', //新文件名(营业执照)
          fileSize: '', //文件大小
          // fileType: "BUSINESS_LICENSE", //文件类型
          fileType: 'ENTRUSTMENT', //文件类型
          relativePath: '', //文件相对路径
          imgSrc: '', //文件绝对路径
          isShow: false,
        },
        {
          //上传图片
          originalName: '', //原文件名
          imgId: '', //图片id
          newName: 'LICENSE', //新文件名(营业执照)
          fileSize: '', //文件大小
          // fileType: "BUSINESS_LICENSE", //文件类型
          fileType: 'BUSINESS_LICENSE', //文件类型
          relativePath: '', //文件相对路径
          imgSrc: '', //文件绝对路径
          isShow: false,
        },
        {
          originalName: '', //原文件名
          imgId: '', //图片id
          newName: 'IDCARDFRONT', //新文件名(身份证)
          fileSize: '', //文件大小
          fileType: 'BOSS_IDCARD_FRONT', //文件类型
          relativePath: '', //文件相对路径
          imgSrc: '', //文件绝对路径
          isShow: false,
        },
        {
          originalName: '', //原文件名
          imgId: '', //图片id
          newName: 'IDCARDBACK', //新文件名(身份证)
          fileSize: '', //文件大小
          fileType: 'BOSS_IDCARD_BACK', //文件类型
          relativePath: '', //文件相对路径
          imgSrc: '', //文件绝对路径
          isShow: false,
        },
      ],
      companyType: '', //A政府部门  B第三方平台  C企业  D工程项目
      boxChecked: false,
    }
  },
  watch: {
    file: {
      handler(val) {
        //所有认证资料上传则提示消失
        if (
          this.companyType === 'GOV' ||
          this.companyType === 'PLAT' ||
          this.companyType === 'CONSTRUCTOR'
        ) {
          if (
            val[0].isShow == true &&
            val[1].isShow == true &&
            val[2].isShow == true &&
            val[3].isShow == true
          ) {
            this.$refs.ruleForm.clearValidate('uploadFile')
          }
        } else if (this.companyType === 'PROJECT') {
          if (
            val[0].isShow == true &&
            val[2].isShow == true &&
            val[3].isShow == true
          ) {
            this.$refs.ruleForm.clearValidate('uploadFile')
          }
        }
      },
      // 这里是关键，代表递归监听 file 的变化
      deep: true,
    },
  },
  created() {},
  mounted() {
    this.companyType = this.$route.query.companyType
  },
  methods: {
    changeProjectName() {
      //不存在项目名称则清空建设方，施工方
      if (!this.ruleForm.projectName) {
        this.ruleForm.pbName = ''
        this.ruleForm.pcName = ''
        return
      }
      this.axios({
        method: 'post',
        url: 'api-p/project/expand/projectnamedetail',
        data: { projectName: this.ruleForm.projectName },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.$message.success({
              message: '项目名称校验成功',
            })
            var data = response.data.result
            this.ruleForm.pbName = data.pbName
            this.ruleForm.pcName = data.pcName
          } else {
            this.$message.error('项目不存在，请输入与系统相同的项目名称')
            this.ruleForm.pbName = ''
            this.ruleForm.pcName = ''
          }
        })
        .catch((response) => {
          // this.$message.error("数据获取失败");
        })
    },
    clearOption() {
      this.ruleForm.pbName = ''
      this.ruleForm.pcName = ''
    },
    //跳转登录
    skipLogin() {
      if (this.isCzUser()) {
        this.$router.replace({
          path: '#/login/loginNextCz',
          name: 'loginNextCz',
          query: {
            type: 'DT',
          },
        })
      } else {
        this.$router.replace({
          path: '#/login/loginNext',
          name: 'loginNext',
          query: {
            type: 'DT',
          },
        })
      }
    },
    //发送验证码倒计时
    countDown() {
      //开启倒计时
      this.isCount = true
      var auth_timetimer = setInterval(() => {
        this.countDownTime--
        if (this.countDownTime <= 0) {
          this.isCount = false
          clearInterval(auth_timetimer)
        }
      }, 1000)
    },
    //发送验证码
    sendVscode() {
      this.axios({
        method: 'post',
        url: 'api-bs/message/base/sendvc',
        data: {
          tel: this.ruleForm.phone.replace(/\s+/g, ''),
        },
      })
        .then(
          (res) => {
            //验证码失败
            if (res.data.hasError) {
              this.noTel = false
              this.$message({
                showClose: true,
                duration: 3000,
                message: '验证码发送失败',
                type: 'error',
              })
            } else {
              this.noTel = false
            }
          },
          (res) => {
            this.$message({
              showClose: true,
              duration: 3000,
              message: '验证码发送失败',
              type: 'error',
            })
            this.noTel = false
            this.isCount = false
          }
        )
        .catch((error) => {
          this.noTel = false
          this.isCount = false
        })
    },
    //发送短信验证码
    getVscode() {
      if (!this.ruleForm.phone) {
        this.$message.error('请输入负责人手机号')
        return
      }
      this.$refs.ruleForm.validateField('phone', (error) => {
        if (error) {
          //return false;
        } else {
          //验证码倒计时
          this.isCount = true
          this.countDownTime = 60
          this.countDown()
          this.sendVscode()
        }
      })
    },
    //图片上传
    ajaxUpload(formName, index, imgName) {
      var options = {
        url: common.uploadUrl + 'api-f/files/upload',
        type: 'post',
        dataType: 'json',
        success: (data) => {
          this.file[index].originalName = data.name
          this.file[index].imgId = data.id
          this.file[index].newName = data.id + imgName
          this.file[index].fileSize = data.size
          this.file[index].relativePath = data.path
          this.file[index].imgSrc = data.url
          this.file[index].isShow = true
        },
        error: (data) => {
          this.$message({
            showClose: true,
            duration: 3000,
            message: '图片上传失败',
            type: 'error',
          })
        },
      }
      $('#' + formName).ajaxSubmit(options)
      return false
    },
    //上传图片
    uploadImg(inputId, index, formName, imgName) {
      var fileName
      var file
      var fileSize
      try {
        fileName = $('#' + inputId).val()
        file = $('#' + inputId)[0].files[0]
        fileSize = (file.size / 1024).toFixed(0)
      } catch (e) {
        this.$message({
          message:
            '您的浏览器暂不支持计算上传文件的大小，确保上传文件不要超过5M，建议使用FireFox、Chrome或IE10以上浏览器。',
          type: 'warning',
        })
      }
      if (fileName) {
        //判断图片类型
        if (!/\.(jpg|jpeg|png|JPG|PNG)$/.test(fileName)) {
          this.$message({
            showClose: true,
            duration: 3000,
            message: '图片类型必须是jpeg，jpg，png中的一种',
            type: 'error',
          })
          $('#' + inputId).val('')
          return
        }
        //判断图片大小
        if (fileSize / 1 > 1024 * 5) {
          this.$message({
            showClose: true,
            duration: 3000,
            message: '图片大小不能超过5M',
            type: 'error',
          })
          $('#' + inputId).val('')
          return
        }
        this.ajaxUpload(formName, index, imgName)
      }
    },
    //获取图片数组
    getImg() {
      const fileArray = new Array()
      for (var j = 0; j < this.file.length; j++) {
        fileArray[j] = {
          originalName: this.file[j].originalName,
          newName: this.file[j].imgId + this.file[j].newName,
          fileSize: this.file[j].fileSize,
          fileType: this.file[j].fileType,
          relativePath: this.file[j].relativePath,
        }
      }
      return JSON.stringify(fileArray)
    },
    //提交表单请求
    submitRequest() {
      this.axios({
        method: 'post',
        url: 'api-m/inputUser/base/v1/register',
        data: {
          inputType: this.companyType,
          name:
            this.companyType === 'PROJECT'
              ? this.ruleForm.projectName
              : this.ruleForm.companyName,
          uscc:
            this.companyType === 'PROJECT'
              ? ''
              : this.ruleForm.uscc.replace(/\s+/g, ''),
          linkman: this.ruleForm.name,
          tel: this.ruleForm.phone.replace(/\s+/g, ''),
          smsCode: this.ruleForm.vscode,
          agreed: 1,
          files: this.getImg(),
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.isRegister = false
            } else {
              this.$message({
                showClose: true,
                duration: 3000,
                message: res.data.errorMsg,
                type: 'error',
              })
            }
            this.isSubmit = false
          },
          (res) => {
            this.$message({
              showClose: true,
              duration: 3000,
              message: '提交失败',
              type: 'error',
            })
            this.isSubmit = false
          }
        )
        .catch((error) => {})
    },
    //提交申请
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          //发送请求,有输入Uscc先通过Uscc效验
          // if (this.companyType === "GOV" || this.companyType === "PLAT" ||this.companyType === "CONSTRUCTOR") {
          //     this.confirmSubmitRequest();
          // } else {
          //     this.submitRequest();
          // }
          this.submitRequest()
        } else {
          return false
        }
      })
    },
    // confirmSubmitRequest() {
    //     this.axios({
    //         method: "post",
    //         url: "api-c/companyaudit/base/validcompanyuscc",
    //         data: {
    //             name: this.ruleForm.companyName,
    //             uscc: this.ruleForm.uscc.replace(/\s+/g, "")
    //         }
    //     })
    //         .then(res => {
    //             if (!res.data.hasError) {
    //                 this.submitRequest();
    //             } else {
    //                 //uncredible【新华信用校验不通过】/pending【已申请未批准】/approved【已注册】
    //                 //除了为新华校验未通过的，其他的错误应该都是不允许提交
    //                 if (res.data.errorCode === "uncredible") {
    //                     this.confirmTip();
    //                 } else {
    //                     this.$message.error(res.data.errorMsg);
    //                 }
    //             }
    //         })
    //         .catch(error => {
    //             this.$message.error("企业信息校验失败，请稍后重试");
    //         });
    // },
    // confirmTip() {
    //     this.$confirm(
    //         "确定提交申请吗？当前企业名称和统一社会信用代码未通过校验，请仔细核对，确保无误",
    //         "提示",
    //         {
    //             cancelButtonClass: "btn-custom-cancel",
    //             type: "warning"
    //         }
    //     )
    //         .then(() => {
    //             this.submitRequest();
    //         })
    //         .catch(() => {});
    // },
    //跳到注册第一步
    toRegister() {
      this.$router.push({
        path: '#/register/registerInterfaceAccount',
        name: 'registerInterfaceAccount',
      })
    },
    //用户注册协议
    toRegistration() {
      let newUrl = this.$router.resolve({
        path: '#/common/registration',
        name: 'registration',
      })
      window.open(newUrl.href, '_blank')
    },
    //信用承诺
    toCreditcommitment() {
      let newUrl = this.$router.resolve({
        path: '#/common/creditCommitment',
        name: 'creditCommitment',
      })
      window.open(newUrl.href, '_blank')
    },
    validUsccAndCompany(companyName, uscc) {
      if (companyName && uscc) {
        this.axios({
          method: 'post',
          url: 'api-c/companyaudit/base/validcompanybyproject',
          data: {
            name: companyName.replace(/\s+/g, ''),
            uscc: uscc.replace(/\s+/g, ''),
          },
        })
          .then((res) => {
            if (!res.data.hasError) {
              this.$message({
                message: '已通过校验',
                type: 'success',
              })
            } else {
              if (res.data.errorCode == 'unmatched') {
                this.$message({
                  message: '未通过校验，请确认信息是否准确',
                  type: 'warning',
                })
              }
            }
          })
          .catch((error) => {
            this.$message.error('验证失败')
          })
      }
    },
    //下载说明书
    downLoad(type) {
      this.axios({
        method: 'post',
        url: 'api-m/inputUser/base/v1/findUrl',
      })
        .then((response) => {
          if (!response.data.hasError) {
            window.open(response.data.result)
          } else {
            this.$message({
              type: 'error',
              message: response.data.msg,
            })
          }
        })
        .catch((error) => {})
    },
  },
}
</script>
<style lang="less" scoped>
.container {
  position: relative;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  .boxWrap {
    background: #f2f4f6;
    position: fixed;
    top: 0;
    left: 0;
    right: -17px;
    bottom: 0;
    background-size: 100% 100%;
    overflow-y: auto;
    .mainBox {
      width: 980px;
      background-color: #fff;
      margin: 0 auto;
      border-radius: 10px;
      margin-bottom: 35px;
      padding: 60px;
      text-align: center;
      position: relative;
      // 提示语
      .reminder {
        text-align: left;
        color: #ff4242;
        font-size: 14px;
        background: #fffbe6;
        border-radius: 3px;
        padding: 0 30px;
        height: 48px;
        line-height: 48px;
        border-radius: 10px 10px 0 0;
        i {
          color: #ffaa00;
          font-size: 20px;
          vertical-align: -2px;
        }
      }
      .formTop {
        color: #666;
        font-size: 14px;
        margin-bottom: 30px;
        .applyTitle {
          margin-top: 35px;
          font-size: 28px;
          color: #333333;
          font-weight: bold;
        }
        .loginLink {
          position: static;
          text-align: right;
          margin: 0 30px;
          padding: 24px 0 16px 0;
          border-bottom: 1px solid #d5dee7;
          .toLogin {
            color: #409eff;
            cursor: pointer;
          }
        }
      }
      .ruleForm {
        width: 500px;
        display: inline-block;
        /deep/ .el-form-item__content {
          text-align: left;
        }
        .el-select {
          width: 100%;
        }
        .areasSelect {
          width: 361px;
        }
        .vscodeInput {
          .el-input {
            width: 205px;
          }
          .vscodeBtn {
            width: 128px;
            border: 1px solid #009588;
            color: #009588;
            margin-left: 19px;
          }
        }
        .radioBox /deep/.el-form-item__content {
          text-align: left;
        }
      }
      .registerBtn {
        margin-top: 0px;
      }
      .suceesRemind {
        font-size: 28px;
        color: #009588;
        margin: 30px 0px 0px;
      }
      .el-dialog img {
        width: 100%;
      }
    }
    .alignCenter {
      text-align: center;
    }
    .registered {
      text-align: center;
      padding: 50px 100px;
      margin-top: 5%;
      .suceesRemind {
        font-size: 28px;
        color: #009588;
        margin: 30px 0px 0px;
      }
      .messageRemind {
        margin-bottom: 25px;
        color: #666;
        font-size: 14px;
        margin-top: 20px;
      }
    }
  }
  //上传图片样式
  .imgBoxs {
    .imgBox {
      text-align: center;
      float: left;
      margin-right: 15px;
      font-size: 12px;
      .imgTopBox {
        width: 104px;
        height: 104px;
        border: 1px dotted #d4dae6;
        position: relative;
        background-color: #f5f7fb;
        .uploadBtn {
          width: 102px;
          height: 73px;
          cursor: pointer;
          input {
            opacity: 0;
            position: absolute;
            left: 0;
            top: 0;
            z-index: 100;
            height: 74px;
            width: 104px;
          }
          i {
            line-height: 74px;
            font-size: 25px;
            color: #b5b6b7;
          }
          img {
            width: 102px;
            height: 73px;
            position: absolute;
            top: 0;
            left: 0;
          }
        }
        .imgName {
          height: 30px;
          line-height: 30px;
          background: rgba(206, 206, 206, 0.3);
          color: #aaa;
        }
      }
    }
  }
  /deep/.el-dialog__body {
    max-height: fit-content;
    text-align: center;
  }
}

.container .boxWrap .registerMainBox {
  padding: 0;
}
.boxWrap /deep/ .topTitleBox {
  background: url('../../../static/img/loginImg/headerBG.png') no-repeat;
  background-size: 100% 100%;
  margin-bottom: 30px;
}
.contarctBorderBottom {
  margin: 30px 0 5px 0;
}
.contarctTopBorder {
  margin: 0 30px;
  position: absolute;
  width: calc(100% - 60px);
  height: 1px;
  background: #d5dee7;
  bottom: 150px;
}
.el-button {
  margin-left: 0;
}
.contract {
  cursor: pointer;
  color: #409eff;
}
</style>
